import 'package:flutter/material.dart';
import 'package:flutter_app/config/colorconfig.dart';
import 'package:liquid_swipe/liquid_swipe.dart';
import 'package:liquid_swipe/Helpers/Helpers.dart';

class journal extends StatefulWidget {
  final nowJournal;
  journal(this.nowJournal);
  @override
  _journalState createState() => _journalState(this.nowJournal);
}

class _journalState extends State<journal> {
  final nowJournal;
  _journalState(this.nowJournal);

  Widget _floatingActionButtonExtended(context) {
    print(nowJournal);
    return Container(
      height: 50,
      width: MediaQuery.of(context).size.width * 0.7,
      child: FloatingActionButton.extended(
        onPressed: () {},
        icon: Icon(Icons.add_circle),
        label: Text('添加手账', textScaleFactor: 1.3),
        backgroundColor: Color.fromRGBO(184, 154, 254, 1),
        shape: BeveledRectangleBorder(),
        isExtended: true,
        materialTapTargetSize: MaterialTapTargetSize.padded,
      ),
    );
  }

  _getPopupMenu(BuildContext context) {
    return <PopupMenuEntry<String>>[
      PopupMenuItem<String>(
        value: 'Gonovon1',
        child: Text('Gonovon1'),
      ),
      PopupMenuItem<String>(
        value: 'Gonovon2',
        child: Text('Gonovon2'),
      ),
      PopupMenuItem<String>(
        value: 'Gonovon3',
        child: Text('Gonovon3'),
      ),
      PopupMenuItem<String>(
        value: 'Gonovon4',
        child: Text('Gonovon4'),
      ),
    ];
  }

  Widget _getJournalPage(context, index) {
    print("index: ${index}");
    return Container(
      height: 400,
      child: RaisedButton(
        onPressed: () {
          Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) => journalFillPage(this.nowJournal)));
        },
        padding: EdgeInsets.all(0),
        color: Colors.white,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(
              flex: 8,
              child: Padding(
                padding: const EdgeInsets.all(0),
                child: Image.asset(nowJournal["imageStream"][index],
                    fit: BoxFit.fill),
              ),
            ),
            Expanded(
              flex: 1,
              child: Column(
                children: <Widget>[
                  Text(
                    nowJournal["imageTitle"][index],
                    style: TextStyle(color: Colors.black),
                  ),
                  Text(
                    '发布时间:2020-03-26',
                    textScaleFactor: 0.7,
                    style: TextStyle(color: darkgreen),
                  ),
                ],
              ),
            )
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              nowJournal["name"],
              style: TextStyle(color: Colors.black),
            ),
            PopupMenuButton(
                itemBuilder: (context) => _getPopupMenu(context),
                icon: Icon(
                  Icons.arrow_downward,
                  color: darkgreen,
                )),
          ],
        ),
        centerTitle: true,
        leading: IconButton(
            icon: Icon(Icons.arrow_back),
            color: darkgreen,
            onPressed: () {
              Navigator.pop(context);
            }),
        actions: <Widget>[
          IconButton(icon: Icon(Icons.settings), onPressed: null)
        ],
        backgroundColor: Colors.white,
        bottom: PreferredSize(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Divider(),
                Container(
                  height: 40,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text('当前手账篇数: ${nowJournal["imageStream"].length}'),
                      Text(
                        '已用${nowJournal["imageStream"].length}页/剩余${10 - nowJournal["imageStream"].length}页',
                        textScaleFactor: 0.7,
                        style: TextStyle(color: darkgreen),
                      ),
                    ],
                  ),
                ),
              ],
            ),
            preferredSize: Size(MediaQuery.of(context).size.width, 40)),
      ),
      body: Padding(
        padding: const EdgeInsets.all(20.0),
        child: GridView.builder(
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              mainAxisSpacing: 20,
              crossAxisSpacing: 15,
              childAspectRatio: 0.5,
            ),
            itemCount: nowJournal["imageStream"].length,
            itemBuilder: this._getJournalPage),
      ),
      floatingActionButton: _floatingActionButtonExtended(context),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
    );
  }
}

class journalFillPage extends StatefulWidget {
  final nowJournal;
  journalFillPage(this.nowJournal);

  @override
  _journalFillPageState createState() => _journalFillPageState(this.nowJournal);
}

class _journalFillPageState extends State<journalFillPage> {
  final nowJournal;
  List<Container> pageList = [];
  _journalFillPageState(this.nowJournal);
  @override
  void initState() {
    super.initState();
    nowJournal["imageStream"].forEach((value) {
      print("nowvalue: $value");
      pageList.add(
        Container(
          child: ConstrainedBox(
              child: Image.asset(
                value,
                fit: BoxFit.cover,
              ),
              constraints: BoxConstraints.expand()),
        ),
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        iconTheme: IconThemeData(color: darkgreen),
        centerTitle: true,
        title: Text(nowJournal["name"], style: TextStyle(color: darkgreen)),
      ),
      body: LiquidSwipe(
        pages: pageList,
        fullTransitionValue: 400,
        enableSlideIcon: true,
        enableLoop: true,
        positionSlideIcon: 0.5,
        waveType: WaveType.liquidReveal,
        onPageChangeCallback: (page) => pageChangeCallback(page),
        currentUpdateTypeCallback: (updateType) =>
            updateTypeCallback(updateType),
      ),
    );
  }

  pageChangeCallback(int page) {
    print(page);
  }

  updateTypeCallback(UpdateType updateType) {
    print(updateType);
  }
}
